
<!DOCTYPE html>
<html lang="zh-CN">

<head>
  <meta charset="UTF-8" />
  <meta name="content-type" content="text/html; charset=utf-8">
  <meta http-equlv="Content-Type" content="text/html;charset=utf-8">
  <meta id="viewport" name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0" />
  <script>

      // FinChatJSBridge 对象兼容层
      if ((typeof logxx === 'function' && logxx('jsbridge start'), !window.FinChatJSBridge)) {
        var hasDocument = window.hasOwnProperty('document'),
          isIOS = !1,
          callbacks = {},
          callbackIndex = 0,
          defaultEventHandlers = {},
          eventPrefix = 'custom_event_',
          handlers = {},
          PROTOCAL = 'FinChat',
          IFRAME_PREFIX = 'hybridjsbrige_'
          
        if (hasDocument) {
          var userAgent = window.navigator.userAgent,
            isAndroid = userAgent.indexOf('Android') != -1
          isIOS = !isAndroid
        }
        var utils = {
          parseData: function (str) {
            var result
            if (str && typeof str === 'string') {
              try {
                result = JSON.parse(str)
              } catch(e) {
                result = {
                  status: {
                    code: 1,
                    msg: 'PARAM_PARSE_ERROR'
                  }
                }
              }
            } else {
              result = str || {}
            }
            return result
          }
        }
        var postMessage = function (event, paramsString, callbackId) {
            // postMessage
            if (isIOS) {
              window.webkit.messageHandlers.invokeHandler.postMessage({
                C: event,
                paramsString: paramsString,
                callbackId: callbackId
              })
            } else {
              var jsCoreHandleResult = FinChatJSCore.invokeHandler(event, paramsString, callbackId)
              if (typeof jsCoreHandleResult !== 'undefined' && typeof callbacks[callbackId] === 'function' && jsCoreHandleResult !== '') {
                try {
                  jsCoreHandleResult = JSON.parse(jsCoreHandleResult)
                } catch(e) {
                  jsCoreHandleResult = {}
                }
                callbacks[callbackId](jsCoreHandleResult),
                delete callbacks[callbackId]
              }
            }
          },
          createIframe = function (uri, sid) {
            var iframe = document.createElement('iframe'),
              iframeId = IFRAME_PREFIX + sid
            iframe.style.display = 'none'
            iframe.setAttribute('id', iframeId)
            iframe.setAttribute('frameborder', '0')
            frame.setAttribute('src', uri)
            document.documentElement.appendChild(iframe)
          // this.messageIframe = messageIframe
          },
          retrieveIframe = function (sid) {
            var iframeId = IFRAME_PREFIX + sid,
              iframe = document.querySelector('#' + iframeId)
            if (iframe) {
              document.documentElement.removeChild(iframe)
            }
          },
          publishHandler = function (event, paramsString, webviewIds) {
            // publishHandler
            isIOS ? window.webkit.messageHandlers.publishHandler.postMessage({
              event: event,
              paramsString: paramsString,
              webviewIds: webviewIds
            }) : FinChatJSCore.publishHandler(event, paramsString, webviewIds)
          },
          invoke = function (event, params, callback) {
            // postMessage
            var paramsString = JSON.stringify(params || {}),
              callbackId = ++callbackIndex
            // reportLog(event,params,'','invoke')
            callbacks[callbackId] = callback
            postMessage(event, paramsString, callbackId)
          },
          invokeCallbackHandler = function (callbackId, params) {
            var callback = callbacks[callbackId]
            // reportLog('invokeCallbackHandler:'+callbackId,params,'','app2view_get')
            typeof callback === 'function' && callback(params),
            delete callbacks[callbackId]
            if (isIOS) retrieveIframe(callbackId)
          },
          oldCallbackHandler = function (data) {
            // {"bridgeParam":{"action":"call","callbackID":"1468927578039","status":{"status_code":-5,"status_reason":"'module' or 'identifier' is unsupported."}}}
            if (data) {
              if (typeof data === 'string') {
                data = utils.parseData(data)
              }
              var callbackId = data.bridgeParam.callbackID
              // 延迟是为了避免：
              // 在 ios 中，如果 onComplete 回调中有 alert 等有阻塞作用的代码时，会导致页面“卡死”（Native UI层级覆盖导致点击无效）
              if (callbackId) {
                setTimeout(function () {
                  invokeCallbackHandler(callbackId, data.param)
                },
                  1)
              }
            }
          },
          publishCallbackHandler = function (callbackId) {
            if (isIOS) retrieveIframe(callbackId)
          },
          on = function (eventName, handler) {
            defaultEventHandlers[eventName] = handler
          },
          publish = function (eventName, params, webviewIds) {
            // publishHandler
            webviewIds = webviewIds || []
            var paramsString, event = eventPrefix + eventName
            paramsString = JSON.stringify(params)
            webviewIds = JSON.stringify(webviewIds)
            publishHandler(event, paramsString, webviewIds)
          },
          subscribe = function (eventName, handler) {
            handlers[eventPrefix + eventName] = handler
          },
          subscribeHandler = function (eventName, data, webviewId, reportParams) {
            // 执行注册的回调
            // reportLog('subscribeHandler:'+eventName,data,[webviewId||''],'app2view_get')
            var handler
            handler = eventName.indexOf(eventPrefix) != -1 ? handlers[eventName] : defaultEventHandlers[eventName]
            if (typeof handler === 'function') {
              handler(data, webviewId, reportParams)
            }
        }
        window.FinChatJSBridge = {
          invoke: invoke,
          invokeCallbackHandler: invokeCallbackHandler,
          oldCallbackHandler: oldCallbackHandler,
          publishCallbackHandler: publishCallbackHandler,
          on: on,
          publish: publish,
          subscribe: subscribe,
          subscribeHandler: subscribeHandler
        }
      }
  </script>
  <script>
     
  function onTest() {
      console.log('aaa')
      FinChatJSBridge.subscribe('PAGE_EVENT', function (params) {
                                document.getElementById('testId').innerHTML = params.data.title                                })
      FinChatJSBridge.publish('PAGE_EVENT', {
        eventName: 'onTest',data: {}
      })
      
  }
  </script>
</head>
<body>
    <div id="testId">我来自视图层!</div><input type="button" value="调用JS逻辑层setData" style="border-radius:15px;background:#ed0c50;border: #EDD70C;color: white;font-size: 14px; width: 80%;" onclick="onTest();" />
</body>
</html>
